<!DOCTYPE html>
<html>

<head>
    <title>查看更多 {$site_info.site_name|default=''}</title>
    <meta name="keywords" content="{$site_info.site_seo_keywords|default=''}" />
    <meta name="description" content="{$site_info.site_seo_description|default=''}">
    <include file="public@head" />
    <link href="__TMPL__/public/assets/css/product.css" rel="stylesheet">
    <link href="__TMPL__/public/assets/css/swiper.min.css" rel="stylesheet">
    <script src="__TMPL__/public/assets/js/swiper.min.js"></script>
    <style>
        .imgyi {
            transition: all 2s ease 0s;
        }

        /* transition 别放hover里，放到img里，这样移入移出一样缓慢，不然只对hover移上去有缓慢效果 */
        .imgyi:hover {
            transform: scale(0.9)
                /*transition: all 2s ease-in-out 0s;*/
        }

        .swiper-container {
            width: 100%;
            height: 100%;
        }

        .swiper-container-shuiping {
            width: 100%;
            height: 100%;
            position: relative;
        }

        .swiper-slide {
            text-align: center;
            font-size: 18px;
            background: #fff;

            /* Center slide text vertically */
            display: -webkit-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            -webkit-justify-content: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
        }

        .weizhi a {
            text-decoration: none;
        }

        .glyphicon-home {
            color: #666;
        }

        .glyphicon-home:hover {
            color: #c51b1b;
        }

        .proje {
            color: #666;
            font-size: 15px;
        }

        .proje:hover {
            color: #c51b1b;
        }

        .hyfxh4 {
            font-size: 12px;
            text-align: center;
            background: #585858;
            padding-top: 10px;
            padding-bottom: 10px;
            margin-top: 0px;
            margin-bottom: 0px;
            font-family: inherit;
            font-weight: 500;
            color: #fff;
        }

        .cjwj span:hover,
        .cjwj p:hover {
            color: #c51b1b;
        }

        .glyphicon-plus-sign {
            font-size: 75px;
            color: #b8b4b3;
        }

        .cjwj p {
            font-size: 21px;
            letter-spacing: 2px;
            text-align: center;
            color: #b8b4b3;
        }

        img {
            margin: 0;
            padding: 0;
            height: auto;
            border: 0;
            max-width: 100%;
            vertical-align: middle;
        }
    </style>
    <hook name="before_head_end" />
</head>
<style>
    a.mask {
        position: relative;
        display: block;
    }

    a.mask:hover:after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        background: rgba(0, 0, 0, .5) url('__TMPL__/public/assets/images/video.png') no-repeat center;
    }
</style>

<body style="background-color:#ebebeb;">
    <!--轮播图开始-->
    <div class="swiper-container">
        <div class="swiper-wrapper">
            <div class="swiper-slide"><img src="__TMPL__/public/assets/images/banner.png" alt=""></div>
            <div class="swiper-slide"><img src="__TMPL__/public/assets/images/banner2.jpg" alt=""></div>
            <div class="swiper-slide"><img src="__TMPL__/public/assets/images/banner3.jpg" alt=""></div>
        </div>
        <!-- Add Arrows -->
        <div class="swiper-button-next"></div>
        <div class="swiper-button-prev"></div>
    </div>
    <!--轮播图结束-->

    <div class="container weizhi" style="height:50px;line-height:50px;padding-left:0px;">
        <a href="/"><span class="glyphicon glyphicon-home" aria-hidden="true"></span></a>
        <span class="glyphicon glyphicon-menu-right" aria-hidden="true" style="color: #666;"></span>
        <a href="{:url('portal/project/projectlist',['post_id'=> $cotegory['id']])}"><strong
                class="proje">{$cotegory.name}</strong></a>
        <span class="glyphicon glyphicon-menu-right" aria-hidden="true" style="color: #666;"></span>
        <a>
            <strong style="font-size: 15px;color: #666;">{$layerName}</strong>
        </a>
    </div>
    <!--项目支持开始-->
    <div class="container" style="height:870px;background-color:#ffffff;">
        <div style="height:90px;line-height: 90px;border-bottom: 2px solid #bebebe;">
            <img style="float:left;padding:34px 30px 0px 0px;" src="__TMPL__/public/assets/images/xianmu.png">
            <h3 style="float:left;padding:10px 20px 0px 0px;font-size:30px;">{$layerName}</h3>
            <h3 style="float:left;font-size:15px;padding-top: 27px">PROJECT SUPPORT</h3>
            <div style="float:right;">
                <form class="navbar-form navbar-left" method="GET" action="{:request()->url()}" role="search"
                    style="line-height: 4;">
                    <div class="form-group">
                        <input type="hidden" name="post_id" value="{:request()->param('post_id')}">
                        <input type="hidden" name="layer" value="{:request()->param('layer')}">
                        <input type="text" class="form-control" name="search" placeholder="查询发布人或标题">
                        <select class="select form-control" size="1" name="group_path" id="group_path"
                            style="height: 38px;">
                            <option disabled selected>分类筛选</option>
                            <option value="2">视频资料</option>
                            <option value="1">文档资料</option>
                        </select>
                        <button type="submit" class="btn btn-default"
                            style="background-color:#ebebeb;color: #333333;border: 1px solid #ccc;">搜索</button>
                    </div>
                </form>
            </div>
        </div>
        <div style="height:30px;">&nbsp;</div>
        <div class="row">
            <foreach $art as $val>
                <div class="col-md-4">
                    <div class="thumbnail" style="height:300px;padding:0px;">
                        <if $val.type==1>
                            <a class="mask" href="{:url('details')}?id={$val.id}"><img width="100%" height="210"
                                    style="height: 210px" src="/upload/{$val.pic}"></a>
                            <else />
                            <embed height="210" width="100%" src='{$val.video}' allowFullScreen='true' quality='high'
                                align='middle' allowScriptAccess='always' type='application/x-shockwave-flash'></embed>
                        </if>
                        <div class="caption">
                            <a href="{:url('portal/Project/details')}?id={$val.id}">
                                <h4 style="font-size: 15px;text-align: center;">{$val.title}......</h4>
                            </a>
                            <p class="col-md-4"><img
                                    src="__TMPL__/public/assets/images/author.png">&nbsp;{$val.author|substr=0,4}
                            </p>
                            <p class="col-md-4"><img src="__TMPL__/public/assets/images/love.png">&nbsp;{$val.zan}
                            </p>
                            <p class="col-md-4"><img src="__TMPL__/public/assets/images/see.png">&nbsp;{$val.view}
                            </p>
                        </div>
                    </div>
                </div>
            </foreach>
            <div class="col-md-4">
                <div class="thumbnail"
                    style="width:360px;height:300px;padding:0px;display: table-cell;vertical-align: middle;text-align:center;">
                    <a href="{:url('add')}?post_id={:request()->param('post_id')}&layer={:request()->param('layer')}"
                        style="text-decoration:none;" class="cjwj addArticle">
                        <span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span>
                        <p>创建文件</p>
                    </a>
                </div>
            </div>
            <div class="col-md-12">
                <nav aria-label="..." style="text-align: center;">
                    <ul class="pagination">
                        {$art->render()}
                    </ul>
                </nav>
            </div>
        </div>
    </div>
    <!--项目支持结束-->

    <div style="height:50px;">&nbsp;</div>

    <!--底部开始-->
    <div class="container-fluid" style="padding:0px;margin: 0 auto;text-align: center;">
        <div class="col-md-12" style="padding:0px;"><img style="width: 100%;"
                src="__TMPL__/public/assets/images/footer.png" alt=""></div>
    </div>
    <!--底部结束-->
</body>
<script>
    var swiper = new Swiper('.swiper-container', {
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
        },
    });

    var swipers = new Swiper('.swiper-container-shuiping', {
        autoplay: {
            disableOnInteraction: false,
        },
        loop: true,
        slidesPerView: 5,
        spaceBetween: 0,
        pagination: {
            el: '.swiper-pagination',
            clickable: true,
        },
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
        },
    });

    $('a.addArticle').on('click', function (e) {
        var url = $(this).attr('href');
        layer.open({
            'title': '添加文章',
            'type': 2,
            "area": ['700px', '560px'],
            'content': url
        })
        return false;
    })
</script>

</html>